<template>
  <a-modal title-align="start" title="刊登" :mask-closable="false" v-model:visible="showvisible" @cancel="showvisible = false" :width="400">
    <a-form auto-label-width ref="formRef" size="medium" :model="form">
      <a-form-item field="shopId" label="店铺" :rules="rules.shopId">
        <a-select placeholder="请选择店铺" v-model="form.shopId" allow-search allow-clear>
          <a-option v-for="(item, index) of shopList" :value="item.id"> {{ item.shopName }}</a-option>
        </a-select>
      </a-form-item>
    </a-form>

    <template #footer class="modal-footer">
      <a-button @click="showvisible = false">取消</a-button>
      <a-button type="primary" :loading="loading" @click="submit">确定</a-button>
    </template>
  </a-modal>
</template>

<script lang="ts" setup>
  import { defineComponent, ref, computed, onMounted } from 'vue'
  import { versionBatchCreateFromSpu, listAllUserWordPressShop } from '@/api/product'
  // import { findShopPageByParam } from '@/api/system'
  import { Message } from '@arco-design/web-vue'
  let props = defineProps(['modelValue', 'ids'])
  let emits = defineEmits(['save', 'update:modelValue'])
  const formRef = ref()
  let showvisible = computed({
    get() {
      return props.modelValue
    },
    set(val) {
      emits('update:modelValue', val)
    },
  })
  let form = ref({
    shopId: '',
  })
  let shopList: any = ref([])
  let loading = ref(false)
  let rules = ref({
    shopId: [{ required: true, message: '请选择店铺' }],
  })

  const submit = async () => {
    const valid = await formRef.value.validate()
    if (valid) return
    try {
      loading.value = true
      let params = {
        shopId: form.value.shopId,
        spuList: props.ids,
      }
      const res: any = await versionBatchCreateFromSpu(params)
      if (res) {
        Message.success('刊登至草稿箱')
        showvisible.value = false
        emits('save')
      }
    } catch (error) {}
    showvisible.value = false
  }

  const getShopLsit = async () => {
    let params = {
      pageSize: 999999,
      platform: 'wooCommerce',
    }
    const res: any = await listAllUserWordPressShop(params)
    shopList.value = res.data || []
    form.value.shopId = shopList.value[0]?.id
  }

  onMounted(() => {
    getShopLsit()
  })
</script>

<style lang="less" scoped></style>
